<template>
    <view class="content">
        <view class="input-group">
            <view class="input-row border">
                <text class="title">手机号：</text>
                <m-input type="text" focus clearable v-model="phone" placeholder="请输入手机号"></m-input>
            </view>
            <view class="input-row border">
                <text class="title">验证码：</text>
                <m-input type="text" clearable v-model="vcode" placeholder="请输入验证码"></m-input>
				<button class="mini-btn" plain type="primary" size="mini" @tap="getVcode">获取验证码</button>
            </view>
        </view>
        <view class="btn-row">
            <button type="primary" class="primary" @tap="register">注册</button>
        </view>
		<view class="action-row">
		    <navigator url="../reg/reg">邮箱注册</navigator>
			<text>|</text>
			<navigator url="../login/phone">手机登录</navigator>
		</view>
    </view>
</template>

<script>
    import service from '../../service.js';
	import network from '../../common/network.js';
	import validator from '../../common/validator.js';
	import sha1 from 'crypto-js/sha1.js'
    import mInput from '../../components/m-input.vue';

    export default {
        components: {
            mInput
        },
        data() {
            return {
                phone: '',
                vcode: ''
            }
        },
        methods: {
            register() {
                if (!validator.isValidPhone(this.phone) || !validator.isValidVcode(this.vcode)) {
                	return
                }
				
				// 注册
				network.request('/api/frontend/users/', 'POST',
					{
						"phone": this.phone,
						"vcode": this.vcode
					},
					function(res) {
						uni.showToast({
						    title: '注册成功'
						});
						uni.navigateTo({
							url: '../login/phone'
						});
					});
            },
			getVcode() {
				if (!validator.isValidPhone(this.phone)) {
					return
				}
				
				// 获取验证码
				network.request('/api/frontend/sms_code/?phone='+this.phone, 'POST',
					{},
					function(res) {
						console.log("vcode:" + JSON.stringify(res))
						uni.showToast({
						    title: '获取验证码成功'
						});
						
						// TOOD 禁用获取验证码按钮，启动定时器
					});
			}
        }
    }
</script>

<style>
@import '../../common/custom.css';
</style>
